{extend name='base'/}

{block name='title'}会员注册{/block}

{block name='main'}
<style>
    .register-form{
        box-shadow: 0 6px 20px 0 rgba(37,43,50,.07);
        border-radius: 16px;
        margin: 3rem auto;
        padding: 2rem;
        min-width: 60%;
    }
</style>
<div class="row m-0">
    <form class="register-form">
        <!--<div class="form-group">-->
            <!--<label for="username">头像</label>-->
            <!--<input type="text" name="data[avatar]" class="form-control" id="avatar" required placeholder="">-->
        <!--</div>-->
        <div class="form-group">
            <label for="username">用户名 <text class="text-danger">*</text></label>
            <input type="text" name="data[username]" class="form-control" id="username" required placeholder="请输入用户名">
            <!--<small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>-->
        </div>
        <div class="form-group">
            <label for="password">密码 <text class="text-danger">*</text></label>
            <input type="password" name="data[password]" class="form-control" id="password" required placeholder="请输入密码">
        </div>
        <div class="form-group">
            <label for="rpassword">再次密码 <text class="text-danger">*</text></label>
            <input type="password" name="data[rpassword]" class="form-control" id="rpassword" required placeholder="请输入再次密码">
        </div>
        <div class="form-group">
            <label for="truename">姓名 <text class="text-danger">*</text></label>
            <input type="text" name="data[truename]" class="form-control" id="truename" required placeholder="请输入姓名">
        </div>
        <div class="form-group">
            <label for="mobile">手机号 <text class="text-danger">*</text></label>
            <input type="text" name="data[mobile]" class="form-control" id="mobile" required placeholder="请输入手机号">
        </div>
        <div class="form-group">
            <label for="email">邮箱</label>
            <input type="email" name="data[email]" class="form-control" id="email" required placeholder="请输入邮箱">
        </div>
        <input type="hidden" name="data[avatar]" class="form-control" id="avatar" value="__IMG__/profile.jpg">
        <button type="button" class="btn btn-primary register-btn">立即注册</button>
        <a href="{:url('User/login')}" class="btn btn-link ml-lg-3">已有账号？立即登录</a>
    </form>
</div>
{/block}

{block name='js'}
<script>
$(function () {
   let lock  = false;
   $(".register-btn").on('click', function () {
       if (lock) {
           return;
       }
       lock = true;
       $.post("{:url('User/register')}", $('.register-form').serialize(), function (res) {
           console.log(res);
           if (res.code == 0) {
               swal("提示", res.msg, {
                   icon : "error",
                   buttons: {
                       confirm: {
                           className : 'btn btn-danger',
                           text : '确定',
                       }
                   },
               });
           }else{
               swal("提示", res.msg, {
                   icon : "success",
                   buttons: {
                       confirm: {
                           className : 'btn btn-success',
                           text : '确定',
                       }
                   }
               }).then(function () {
                   window.location.replace("{:url('User/login')}");
               });
           }
           lock = false;
       }, 'json');
   });
});
</script>
{/block}